<template>
	<view>
		<cu-custom bgColor="bg-blue" :isBack="false">
		  <block slot="content">我的</block>
		</cu-custom>
		<view class="head text-white">
			<view>1857477827</view>
			<view class="text-sm margin-top-xs">放心靠谱的托运公司~</view>
		</view>
		
		<view class="items" style="margin-top: -220rpx;">
			<view>我的订单</view>
			<view class="flex align-center text-center justify-around flex-wrap">
				<view class="padding-tb ">
					<image src="../../static/images/order_all.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">全部订单</view>
				</view>
				<view class="padding-tb ">
					<image src="../../static/images/order_no_pay.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">待付款</view>
				</view>
				<view class="padding-tb ">
					<image src="../../static/images/in_service.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">服务中</view>
				</view>
				<view class="padding-tb ">
					<image src="../../static/images/finish.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">已完成</view>
				</view>
			</view>
		</view>
		
		<view class="margin radius" style="border-radius: 30rpx;margin-top: -100rpx;">
			<image src="../../static/images/ads.png" class="radius" style="width: 100%;border-radius: 30rpx;" mode="aspectFit"></image>
		</view>
		
		<view class="items" style="margin-top: -100rpx;">
			<view>常用功能</view>
			<view class="flex align-center text-center justify-around flex-wrap">
				<navigator url="/pages/my/about" class="padding-tb">
					<image src="../../static/images/about.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">关于我们</view>
				</navigator>
				<view class="padding-tb ">
					<image src="../../static/images/kefu.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">联系我们</view>
				</view>
				<navigator url="/pages/my/feedback" class="padding-tb ">
					<image src="../../static/images/ts.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">反馈投诉</view>
				</navigator>
				<view class="padding-tb ">
					<image src="../../static/images/wechat.png" mode="aspectFill" class="order_icon"></image>
					<view class="text-sm margin-top-xs">公众号</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style scoped lang="scss">
	.head{
		 background-image: linear-gradient(to bottom, #0081ff 0%, #9ab5fe 100%);
		 height: 360rpx;
		border-bottom-left-radius: 50% 40rpx;  /* 水平半径 50%，垂直半径 40rpx */
		border-bottom-right-radius: 50% 40rpx;
		overflow: hidden;  /* 防止内部内容溢出影响圆角 */
		padding-left: 50rpx;
	}
	.items {
	  background-color: #ffffff;
	  margin: 30rpx;
	  padding: 25rpx 20rpx; /* 左右padding减小 */
	  border-radius: 20rpx;
	  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
	  
	}
	.order_icon{
		width: 65rpx;
		height: 65rpx;
	}

</style>
